<template>
    <div class="top">
        <img src="../../assets/img/头部.png" alt="">
    </div>
    <div class="adrm-top1">
        <router-link :to="'/index'">
            <img src="@/assets/img/左箭头.png" alt="">
        </router-link>
    </div>
    <div class="index-input-wrapper1">
        <img src="@/assets/img/放大镜.png" alt="">
        <input class="input1" type="text" placeholder="请输入商品名称搜索">
    </div>
    
   
    <div class="index-mid-mid">
        <div class="mid-left">
            <img src="@/assets/img/沃尔玛.png" alt="">
        </div>
        <div class="mid-right">
            <div class="mid-right-top">
                <span>沃尔玛</span>
            </div>
            <div class="mid-right-mid">
                <div>
                    <span>月售1万+</span>
                </div>
                <div>
                    <span>起送¥0</span>
                </div>
                <div>
                    <span>基础运费¥5</span>
                </div>
            </div>
            <div class="mid-right-bottom">
                <span>VIP尊享满89元减4元运费券（每月3张）</span>
            </div>
        </div>
    </div>
    <div class="content">
        <div class="content1">
            <div class="content2">
                全部商品
            </div>
            <div class="content3">
                秒杀
            </div>
            <div class="content3">
                新鲜水果
            </div>
            <div class="content3">
                休闲食品
            </div>
            <div class="content3">
                时令蔬菜
            </div>
            <div class="content3">
                肉蛋家禽
            </div>
        </div>
        <div class="content4">
        <div class="content5">
            <div class="content6">
                <img
                    src="@/assets/img/番茄.png"
                    alt=""
                    class="content7"
                />
            </div>
            <div class="content8">
                <div class="content__top">番茄250g/份</div>
                <div class="content__middle">月售10件</div>
                <div class="content__bottom">
                    <div class="content__price">
                        <div class="content__promotion">¥33.6</div>
                        <div class="content__original">¥33.6</div>
                    </div>
                    <router-link :to="'/shangpin'">
                    <div class="content__count">
                        <span class="content__plus-iconfont"> + </span>
                    </div>
                    </router-link>
                </div>
            </div>
        </div>

        <div class="content5">
            <div class="content6">
                <img
                    src="@/assets/img/提子.png"
                    alt=""
                    class="content7"
                />
            </div>
            <div class="content8">
                <div class="content__top">提子250g/份</div>
                <div class="content__middle">月售10件</div>
                <div class="content__bottom">
                    <div class="content__price">
                        <div class="content__promotion">¥33.6</div>
                        <div class="content__original">¥33.6</div>
                    </div>
                    <div class="content__count">
                        <span class="content__plus-iconfont"> + </span>
                    </div>
                </div>
            </div>
        </div>


        <div class="content5">
            <div class="content6">
                <img
                    src="@/assets/img/螃蟹.png"
                    alt=""
                    class="content7"
                />
            </div>
            <div class="content8">
                <div class="content__top">螃蟹250g/份</div>
                <div class="content__middle">月售10件</div>
                <div class="content__bottom">
                    <div class="content__price">
                        <div class="content__promotion">¥33.6</div>
                        <div class="content__original">¥33.6</div>
                    </div>
                    <div class="content__count">
                        <span class="content__plus-iconfont"> + </span>
                    </div>
                </div>
            </div>
        </div>


        <div class="content5">
            <div class="content6">
                <img
                    src="@/assets/img/橙子.png"
                    alt=""
                    class="content7"
                />
            </div>
            <div class="content8">
                <div class="content__top">橙子250g/份</div>
                <div class="content__middle">月售10件</div>
                <div class="content__bottom">
                    <div class="content__price">
                        <div class="content__promotion">¥33.6</div>
                        <div class="content__original">¥33.6</div>
                    </div>
                    <div class="content__count">
                        <span class="content__plus-iconfont"> + </span>
                    </div>
                </div>
            </div>
        </div>


        




    </div>
    
    </div>


    <div class="cart">
        <div class="cart1">
            <div class="cart2">
                <img class="cart3" src="@/assets/img/购物篮0.png"/>
                
            </div>
            <div class="cart5">
                购物车是空的
            </div>
        </div>
        <div class="cart7">
                去结算
        </div>
    </div>
    
</template>

<script>
import { navData } from "@/untils/nav"
import "@/assets/css/index.css";
import "@/assets/css/shangpin.css";
export default {
    setup() {
        return {
            name: "Cart",
            navData
        }
    }
};
</script>

<style>

</style>